<!-- ignore the following lines, they are not important to this demo -->
<jigsaw-demo-description [summary]="summary" [content]="description">
</jigsaw-demo-description>

<!-- start to learn the demo from here -->
<div class="live-demo-wrap">
    <h2>ContentWidth</h2>
    <div class="demo-1 live-demo">
        <h3>contentWidth默认值为'auto'</h3>
        <jigsaw-table [data]="tableData" height="400"></jigsaw-table>
    </div>

    <div class="demo-2 live-demo">
        <h3>设置contentWidth数值</h3>
        <jigsaw-table [data]="tableData" height="400" contentWidth="1500"></jigsaw-table>
    </div>

    <div class="demo-2 live-demo">
        <h3>contentWidth='auto'与columnDefine结合使用</h3>
        <p class="comment">限制了table的宽度为1000时，会产生横向滚动条，这时可以通过columnDefines来调节列宽</p>
        <jigsaw-table [data]="tableData" width="1000" height="400" [columnDefines]="columnDefines"></jigsaw-table>
    </div>
</div>

